@import '@common/styles/index.scss';

.userMobileWrapper {
  :global {
    .dzq-modal__container {
      width: rem(409);
      height: rem(423);
      border-radius: rem($border-radius-small);
      background: $white;
      box-sizing: border-box;
      padding: rem($padding-6n);
    }
    .dzq-modal__body {
      padding: 0;
    }
  }
}

.userMobileContent {
  .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: rem($margin-6n);
  }
  .text {
    flex: 1;
    text-align: center;
    font-size: rem($font-size-middle);
    font-weight: 600;
  }
  .titleValue {
    flex: 1;
    text-align: center;
    font-size: rem($font-size-middle);
    color: $text-color-primary;
    font-weight: $font-weight-regular;
    letter-spacing: 1px;
  }
  .inputItem {
    margin-bottom: rem($margin-6n);
    .labelName {
      font-size: rem($font-size-base);
      color: $text-color-regular;
    }
    .labelValue {
      position: relative;
    }
    :global {
      .dzq-input {
        width: 100%;
        height: rem(44);
        margin-top: rem($margin-4n);
      }
      .dzq-input__inner {
        width: 100%;
        height: rem(44);
      }
      .dzq-icon {
        line-height: rem(44);
      }
    }
  }
  .bottom {
    position: absolute;
    bottom: rem(24);
    width: 90%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .btn {
    width: rem(248);
    height: rem(36);
    line-height: rem(36);
    padding: 0;
  }
  .tips {
    text-align: right;
    color: $primary-color;
    cursor: pointer;
  }
}

.bgBtnColor {
  :global {
    .dzq-button--primary.is-mouseenter {
      @include button-primary();
    }
  }
}
